<%@ page  contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="page" uri="http://www.forten.org/taglib/page"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="forten" uri="http://www.forten.org/taglib/forten"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>已选课程</title>
<!-- CSS -->
<link type="text/css" rel="stylesheet" href="../styles/css/reset.css">
<link type="text/css" rel="stylesheet" href="../styles/css/index.css">
<link type="text/css" rel="stylesheet" href="../styles/css/button.css">
<script type="text/javascript" src="../scripts/html5.js"></script>
<!-- end -->
<!-- fancybox -->
<script>
	!window.jQuery
			&& document
					.write('<script src="../scripts/fancybox/jquery-1.4.3.min.js"><\/script>');
</script>
<script type="text/javascript"
	src="../scripts/fancybox/jquery.fancybox-1.3.4.pack.js" charset="utf-8"></script>
<link media="screen" type="text/css" rel="stylesheet"
	href="../scripts/fancybox/jquery.fancybox-1.3.4.css">
<!-- end -->
<style type="text/css">
.textarea{color: gray;}
</style>
</head>
<body>
	<script type="text/javascript">
		$(document).ready(function() {
			$('#hidden1').click(function(event) {
				$('#table1').animate({opacity:'toggle',height:'toggle'},'fast')
			});
			$('#hidden2').click(function(event) {
				$('#table2').animate({opacity:'toggle',height:'toggle'},'fast')
			});
			
				<c:forEach items="${dto}" var="dto" varStatus="s">
				$("#cancelCourse${s.index }").fancybox({
					'titlePosition' : 'inside',
					'transitionIn' : 'none',
					'transitionOut' : 'none'
				});
				$("#leave${s.index }").fancybox({
					'titlePosition' : 'inside',
					'transitionIn' : 'none',
					'transitionOut' : 'none'
				});
				
				
				 /*   $("#leaveReason${s.index }").focus(function() {
				       if ($(this).val() == "请输入请假原因")
				           $(this).val("");
				       $(this).removeClass("textarea");
				   }).blur(function() {
				   if ($(this).val() == "") {
				           $(this).val("请输入请假原因"); $(this).addClass("textarea");
				       }
				   }); */
				   
				   $("#cancelReason${s.index }").focus(function() {
				       if ($(this).val() == "请输入退课原因")
				           $(this).val("");
				       $(this).removeClass("textarea");
				   }).blur(function() {
				   if ($(this).val() == "") {
				           $(this).val("请输入退课原因"); $(this).addClass("textarea");
				       }
				   });
				   </c:forEach>
		});
		function showOrHidden(id) {
			var isShow = document.getElementById(id);
			if (isShow.innerHTML == '收起') {
				isShow.innerHTML = '展开';
			} else {
				isShow.innerHTML = '收起';
			}
		}

		function doCancelCourse(id) {
			if (confirm("您正在为选中的干部进行退课操作，确认继续吗？")) {
				document.frm.action = "cancelCourseByAdmin.jspx?selectedCourseId="
						+ id;
				document.frm.submit();
			} else {
				return false;
			}
		}
	</script>
	<c:if test="${! empty message}">
		<script type="text/javascript" language="javascript">
		 window.onload =function(){
			 var message = "${message}";
			 alert(message);
		 }
		</script>
	</c:if>

	<header>
	<div class="headerWrap"></div>
	</header>

	<div class="content">

		<section>
		<div class="rc_info mt20">
			<h3>
				<span class="r_title_ico"></span>当前所选课程信息
			</h3>
		</div>
		<table class="rc_tab01" cellspacing="0" cellpadding="0"
			style="width: 80%;">
			<tbody>
				<tr>
					<th style="text-align: center;">课程号</th>
					<th style="text-align: center;">课程名</th>
					<th style="text-align: center;">教师</th>
					<th style="text-align: center;">学时</th>
				</tr>
				<tr>
					<td style="text-align: center;">${dtoCourse.num }</td>
					<td style="text-align: center;">${dtoCourse.name }</td>
					<td style="text-align: center;">${dtoCourse.teacherName }</td>
					<td style="text-align: center;">${dtoCourse.credit }</td>
				</tr>
			</tbody>
		</table>
		<br>
		<div class="rc_info mt20">
			<h3>
				<span class="r_title_ico"></span> 选课信息
			</h3>
		</div>
		<div class="rc_fbt">
			<p class="right">
				<a class="btn2 mt7" id="hidden1"> <span id="tableButton1"
					onclick="showOrHidden('tableButton1');">收起</span>
				</a>
			</p>
		</div>
			<table class="rc_tab01" cellspacing="0" cellpadding="0"
				 id="table1">
				<tbody>
					<tr>
						<th style="width: 15%; text-align: center;">工作证号</th>
						<th style="width: 15%; text-align: center;">姓名</th>
						<th style="width: 10%; text-align: center;">课程号</th>
						<th style="width: 10%; text-align: center;">课程名</th>
						<th style="width: 15%; text-align: center;">操作人工作证号</th>
						<th style="width: 15%; text-align: center;">操作时间</th>
						<th style="width: 15%; text-align: center;">操作</th>
					</tr>
					<c:forEach items="${dto }" var="dto" varStatus="s">
						<tr>
							<td style="text-align: center;">${dto.cadreDto.cardNum }</td>
							<td style="text-align: center;">${dto.cadreDto.name }</td>
							<td style="text-align: center;">${dto.courseDto.num }</td>
							<td style="text-align: center;">${dto.courseDto.name }</td>
							<td style="text-align: center;">${dto.selectCardId}</td>
							<td style="text-align: center;"><fmt:formatDate
									value="${dto.selectTime }" pattern="yyyy年MM月dd日HH时mm分" /></td>
							<td class="rc_cr" style="text-align: center;">
								
							    <a id="cancelCourse${s.index }" href="#inline1${s.index }" title="退课原因" >退课</a>
						</td>		
						</tr>
						<div style="display: none;">
								<div id="inline1${s.index }"
									style="width: 400px; height: 100px; overflow: auto; word-break: break-all;">
							<form action="cancelCourseByAdmin.jspx" method="post"
								onsubmit="if(document.getElementById('cancelReason${s.index }').value =='请输入退课原因')document.getElementById('cancelReason${s.index }').value='';">
								<input type="hidden" value="${dto.id}" name="selectedCourseId"
									id="selectedCourseId" />
									<forten:token name="ccByAd"></forten:token>
								<textarea rows="4" cols="30" name="cancelReason"
									id="cancelReason${s.index }" class="textarea">请输入退课原因</textarea>
								<br> <input type="submit" value="确定" class="button" />
							</form>
						</div>
						</div>	
						
					</c:forEach>
				</tbody>
			</table>

		<div class="rc_info mt20">
			<h3>
				<span class="r_title_ico"></span> 退课信息
			</h3>
		</div>
		<div class="rc_fbt">
			<p class="right">
				<a class="btn2 mt7" id="hidden2"> <span id="tableButton2"
					onclick="showOrHidden('tableButton2');">收起</span>
				</a>
			</p>
		</div>
		<table class="rc_tab01" cellspacing="0" cellpadding="0"
			 id="table2">
			<tbody>
				<tr>
					<th style="width: 15%; text-align: center;">工作证号</th>
					<th style="width: 10%; text-align: center;">姓名</th>
					<th style="width: 10%; text-align: center;">性别</th>
					<th style="width: 15%; text-align: center;">院系别处</th>
					<th style="width: 15%; text-align: center;">退课时间</th>
					<th style="width: 15%; text-align: center;">退课操作人</th>
				</tr>
				<c:forEach items="${dto_cancelCourse}" var="dto" varStatus="s">
					<tr>
						<td style="text-align: center;">${dto.cadreDto.cardNum }</td>
						<td style="text-align: center;">${dto.cadreDto.name }</td>
						<td style="text-align: center;">${dto.cadreDto.sex }</td>
						<td style="text-align: center;">${dto.cadreDto.unitName }</td>
						<td style="text-align: center;"><fmt:formatDate
								value="${dto.cancelTime }" pattern="yyyy年MM月dd日HH时mm分" /></td>
						<td style="text-align: center;">${dto.cancelCardId }</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
		<div class="rc_fbt">
			<p class="right">
				<a class="btn2 mt7"
					href="gotoCourseSelectionAdmin.jspx"> <span>返回</span>
				</a>
			</p>
		</div>
		</section>

	</div>

<%@include file="/common/foot.jsp"%>